<!--  子类分析 -->
<template>
  <div class="clas_All">
    <el-form class="const_top" :model="queryParams" size="small" :inline="true">
      <el-row>
        <el-col :span="24">
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.shopId"
              placeholder="请输入店铺编码"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.shopName"
              placeholder="请输入店铺名称"
              clearable
            />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" size="mini" @click="handleQuery"
              >查询
            </el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-table
      :data="menuList"
      row-key="menuId"
      class="cost_tbale"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
    >
      <el-table-column align="center" prop="shopID" label="店铺编码">
      </el-table-column>
      <el-table-column align="center" prop="shopName" label=" 店铺名称">
      </el-table-column>
      <el-table-column align="center" prop="brandName" label=" 品牌">
      </el-table-column>
      <el-table-column align="center" prop="acspType" label=" 收银商">
      </el-table-column>
      <el-table-column align="center" prop="shopAddress" label="地址">
      </el-table-column>
      <el-table-column align="center" prop="status" label="状态">
        <template slot-scope="scope">
          <div>
            <!-- {{ scope.row }} -->
            <span v-if="scope.row.status == 1">正常</span>
            <span v-else-if="scope.row.status == 9">禁用</span>
            <span v-else>未知</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="shopCityName" label="所属城市">
      </el-table-column>

      <el-table-column label="操作" prop="" align="center">
        <template slot-scope="scope">
          <div>
            <span v-if="scope.row.flag">
              已开通
              <el-button
                size="mini"
                type="text"
                style="margin: 0 0 0 10px"
                v-hasPermi="['bom:food:updateAll']"
                @click="tongbu(scope.row)"
                >同步部门信息</el-button
              >
            </span>
            <span v-else>
              <el-button
                size="mini"
                type="text"
                v-hasPermi="['bom:food:updateAll']"
                @click="Openkaitong(scope.row)"
                >开通</el-button
              >
            </span>
          </div>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getShopQuery"
    />
  </div>
</template>

<script>
import { shopFind, shopQuery, shopsync } from "@/api/system/StoreManagement.js";
export default {
  data() {
    return {
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      examineOption: [],
      menuList: [],
      total: 0,
    };
  },
  methods: {
    handleQuery() {
      this.getShopQuery();
      this.queryParams.shopname = "";
      this.queryParams.shopid = "";
    },
    getShopQuery() {
      // console.log(this.queryParams);
      shopFind({ ...this.queryParams }).then((res) => {
        this.total = res.total;
        this.menuList = res.rows;
      });
    },
    Openkaitong(v) {
      // console.log(v);
      shopQuery({ shopCode: v.shopID, id: v.id }).then((res) => {
        if (res.code == 200) {
          if (res.data) {
            this.getShopQuery();
          }
        }
      });
    },
    tongbu(v) {
      // console.log(v);
      shopsync({ deptCode: v.deptCode }).then((res) => {
        if (res.code == 200) {
          // console.log(res);
          if (res.data) {
            this.$modal.msgSuccess("同步成功");
          } else {
            this.$message({
              message: "同步失败",
              type: "warning",
            });
          }
        }
      });
    },
  },
  mounted() {
    this.getShopQuery();
  },
};
</script>

<style lang="scss" scoped>
.clas_All {
  margin: 20px;
}
</style>
